<template>
    <Layout style="height: 100vh">
        <Header style="color: white">
            <div style="color: white ;float: left;position: relative;top: 0px;left: 0px;">
                <MenuItem name="0" to="/yxb_vue/home">优信保公司后台管理系统</MenuItem>
            </div>
        </Header>
        <Content style="display: flex;align-self: center;padding-top: 5vh;padding-bottom: 20vh">
            <Card style="width: 50vw;border-radius: 10px">
                <div align="center" style="padding-top: 10vh">
                    <h2 style="padding-bottom: 10px">后台登陆</h2>
                    <div style="padding-bottom: 10px">
                        账号:
                        <Input prefix="ios-contact" v-model="user_name" placeholder="输入账号" clearable
                               style="width: auto"/>
                    </div>
                    <div style="padding-bottom: 10px">
                        密码:
                        <Input prefix="md-key" v-model="password" type="password" placeholder="输入密码" clearable
                               style="width: auto"/>
                    </div>
                    <Button type="success" @click="onLogin">登陆
                        <Icon type="md-log-in"/>
                    </Button>
                </div>

            </Card>
        </Content>

        <Footer style="text-align: center">Created By Cendeal</Footer>
    </Layout>
</template>

<script>
    import axios from 'axios'
    export default {
        name: "login",
        data: function () {
            return {
                user_name: "",
                password: "",

            }
        },
        methods: {
            onLogin() {
                if(this.user_name!==""&&this.password!==""){
                    console.log(this.user_name)

                    this.$store.dispatch('doLogin',{user_name:this.user_name,password:this.password}).then((res)=>{
                        if(res.data.code==0){
                            this.$router.push("/yxb_vue/home")
                        }else {
                            this.$Notice.open({
                                title: '提醒',
                                desc:res.data.msg,
                                duration: 1
                            });
                        }
                    })
                }

            }
        }
    }

</script>

<style scoped>

</style>